<%@ include file="../common/top.jsp" %>

<div id="BackLink">
    <a href="mainFrom">Return to Main Menu</a>
</div>

<div id="Catalog">

    <div id="Cart">

        <h2>Shopping Cart</h2>
        <form action="cartForm" method="post" id="cartForm">
            <table>
                <tr>
                    <th><b>Item ID</b></th>
                    <th><b>Product ID</b></th>
                    <th><b>Description</b></th>
                    <th><b>In Stock?</b></th>
                    <th><b>Quantity</b></th>
                    <th><b>List Price</b></th>
                    <th><b>Total Cost</b></th>
                    <th>&nbsp;</th>
                </tr>

                <c:if test="${sessionScope.cart.numberOfItems == 0}">
                    <tr>
                        <td colspan="8"><b>Your cart is empty.</b></td>
                    </tr>
                </c:if>

                <c:forEach var="cartItem" items="${sessionScope.cart.cartItemList}">
                    <tr>
                        <td>
                            <a href="itemForm?itemId=${cartItem.item.itemId}">${cartItem.item.itemId}</a>
                        </td>
                        <td>${cartItem.item.product.productId}</td>
                        <td>${cartItem.item.attribute1} ${cartItem.item.attribute2}
                                ${cartItem.item.attribute3} ${cartItem.item.attribute4}
                                ${cartItem.item.attribute5} ${cartItem.item.product.name}</td>
                        <td>${cartItem.inStock}</td>


                        <td><input type="text" name="${cartItem.item.itemId}" value="${cartItem.quantity}"
                                   class="quantity-field"/></td>


                        <td><fmt:formatNumber value="${cartItem.item.listPrice}"
                                              pattern="$#,##0.00"/></td>
                        <td><fmt:formatNumber value="${cartItem.total}"
                                              pattern="$#,##0.00"/></td>
                        <td>
                            <a class="button" href="removeItemFromCart?itemId=${cartItem.item.itemId}">Remove</a>
                        </td>
                    </tr>
                </c:forEach>
                <tr>
                    <td colspan="7">Sub Total:
                        <fmt:formatNumber value="${sessionScope.cart.subTotal}" pattern="$#,##0.00"/>
                        <%--<input type="submit" name="updateCartQuantities" value="Update Cart" /></td>--%>
                    <td>&nbsp;</td>
                </tr>
            </table>
        </form>

        <c:if test="${sessionScope.cart.numberOfItems > 0}">
            <%--            <a href="newOrderForm" class="Button"  id="showModalBtn">Proceed to Checkout</a>--%>
            <button id="showModalBtn">Proceed to Checkout</button>
        </c:if>
    </div>

    <div id="MyList">
        <c:if test="${sessionScope.account != null}">
            <c:if test="${sessionScope.account.isListOption()}">
                <%@ include file="IncludeMyList.jsp" %>
            </c:if>
        </c:if>
    </div>

    <div id="customModal">
        <div id="modalContent"></div>
    </div>

    <div id="customModal1">
        <div id="modalContent1"></div>
<%--        <span id="closeModalBtn1">&times;</span>--%>
    </div>

    <div id="customModal2">
        <div id="modalContent2"></div>
<%--        <span id="closeModalBtn2">&times;</span>--%>
    </div>


    <div id="Separator">&nbsp;</div>
</div>
<%@ include file="../common/bottom.jsp" %>